import { Component, OnInit } from '@angular/core';

import { StorageService } from '../../services/storage.service';

/**
 * 不推荐
 *    const storage = new StorageService()
 *    storage.get()
 *    在constructor里的用法相当于此 ⬆
 */

@Component({
  selector: 'app-todolist',
  templateUrl: './todolist.component.html',
  styleUrls: ['./todolist.component.less']
})
export class TodolistComponent implements OnInit {

  public keyword: string = ''
  public todoList: Array<any> = []

  constructor(public storage: StorageService) {

  }

  ngOnInit(): void {
    const data = this.storage.get('listVal')
    this.todoList = data ? data : []
  }

  searchInput(e): void {
    if (e.keyCode == 13) {
      this.keyword = this.keyword.trim()
      let flag: boolean = this.todoList.some((val) => {
        return val.title == this.keyword
      })
      if (!flag && this.keyword) {
        this.todoList.unshift({
          title: this.keyword,
          finished: false
        })
      }
      this.keyword = ''
      this.storage.set('listVal', this.todoList)
    }
  }

  deleteItem(key): void {
    this.todoList.splice(key, 1)
    this.storage.set('listVal', this.todoList)
  }

  inputChange(e): void {
    console.log(e.target.checked)
    this.storage.set('listVal', this.todoList)
  }

}
